<template>
    <dl :class="{'border':border==='border'}">
        <dt v-if="icon">
            <img :src="icon" alt="">
        </dt>
        <dd>{{label}}</dd>
    </dl>
</template>
<script>
export default {
    // props:['icon','label','border']
    props:{
        icon:{
            type:String,
            default:'https://img02.hua.com/app/icon/more_btn.png'
        },
        label:{
            type:String
        },
        border:{
            type:String
        }
    }
}
</script>
<style lang="scss">
    dl{
        width:25%;
        dt{
            width:80px;
            height:80px;
            img{
                width:100%;
            }
        }
        dd{
            font-size:12px;
            text-align: center;
        }
        &.border{
            border:1px solid blue;
            padding:10px;
            display: flex;
            dt{
                width:20px;
                height:20px;
            }
        }
    }
</style>

